<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>后台登录-X-admin2.0</title>
        <meta name="renderer" content="webkit|ie-comp|ie-stand">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <meta http-equiv="Cache-Control" content="no-siteapp" />

        <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
        <link rel="stylesheet" href="/cms/css/font.css">
        <link rel="stylesheet" href="/cms/css/xadmin.css">
    </head>
    <body>
        <div class="x-body">

            <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
            <div id="main" style="width: 100%;height:400px;"></div>

        </div>
        <script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
        <script src="/js/jquery.min.js"></script>
        <script type="text/javascript">
           $(function () {
             $.ajax({
               url:'/welcome/data',
               success:function (result) {
                 // 基于准备好的dom，初始化echarts实例
                 var myChart = echarts.init(document.getElementById('main'));

                 // 指定图表的配置项和数据
                 var option = {
                   title: {
                     text: '系统相关折线图'
                   },
                   tooltip: {
                     trigger: 'axis'
                   },
                   legend: {
                     data:['新增文章总数','新增资源总数','新增评论总数','新增用户总数']
                   },
                   grid: {
                     left: '3%',
                     right: '4%',
                     bottom: '3%',
                     containLabel: true
                   },
                   toolbox: {
                     feature: {
                       saveAsImage: {}
                     }
                   },
                   xAxis: {
                     type: 'category',
                     boundaryGap: false,
                     data: result.data.date
                   },
                   yAxis: {
                     type: 'value'
                   },
                   series: [
                     {
                       name:'新增文章总数',
                       type:'line',
                       stack: '总量',
                       data:result.data.articleCountList
                     },
                     {
                       name:'新增资源总数',
                       type:'line',
                       stack: '总量',
                       data:result.data.downloadCountList
                     },
                     {
                       name:'新增评论总数',
                       type:'line',
                       stack: '总量',
                       data:result.data.commentCountList
                     },
                     {
                       name:'新增用户总数',
                       type:'line',
                       stack: '总量',
                       data:result.data.userCountList
                     }
                   ]
                 };


                 // 使用刚指定的配置项和数据显示图表。
                 myChart.setOption(option);
               }
             })
           })


    </script>
    
    </body>
</html>